<template>
	<view>
		
		<u-popup :show="show" closeOnClickOverlay @close="$emit('close')" closeable>
			<view class="sku">
				<view class="absolute">
					<image class="sku_image" :src="currentInfo.image" mode="aspectFill"></image>
					<view class="sku_info">
						<view>{{currentInfo.title}}</view>
						<view class="title">{{item.title}}</view>
						<view style="color: #ff0000;font-weight: bold;">
							<span style="font-size: 20rpx;">￥</span> <span>{{currentInfo.price}}</span>
						</view>
						<view style="color: #939393;font-size: 20rpx;margin-top: 12rpx;">库存{{currentInfo.inventory}}
						</view>
					</view>
				</view>
				<u-line></u-line>
				<view style="display: flex;align-items: center;padding: 30rpx 0;justify-content: space-between;">
					<span>数量</span>
					<u-number-box v-model="number" :max="currentInfo.inventory"></u-number-box>
				</view>
				<u-line></u-line>
				<view class="btn-box">
					<u-button color="#F39800" shape="circle" text="加入租赁车" @click="addShopCart()"></u-button>
					<u-button color="#FF4544" shape="circle" text="立即租赁" @click="goOrder"></u-button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		watch: {
			show(value) {
				console.log("当前商品信息",this.currentInfo)
				if(value) this.number = 1
			}
		},
		props: {
			item: Object,
			show: {
				type: Boolean,
				defaultValue: false
			},
			currentInfo: Object
		},
		name: "skuBuy",
		data() {
			return {
				number: 1
			};
		},
		methods: {
			goOrder(){
				let currentInfo_id = encodeURIComponent(this.currentInfo._id)
				uni.navigateTo({
					url:`/pages/order/order?type=sku&number=${this.number}&product_id=${currentInfo_id}&price=${this.currentInfo.price}`,
					
				})
			},
			async addShopCart() {
				console.log('number', this.number)
				console.log('currentInfo', this.currentInfo)
				this.currentInfo.merchandise_id = this.currentInfo._id
				
				this.porduct_info = {...this.currentInfo}
				
				delete this.porduct_info._id
				try{
					let res = await vk.callFunction({
						url: 'client/pages/shopcart/kh/shopcart_add',
						title:"加入中...",
						data: {
							merchandise_info: {
								...this.porduct_info,
							},
							number:this.number
						}
					});
					uni.showToast({
						title:'加入购物车成功!',
						icon:'none'
					})
				}catch(err){
					console.log(1)
				}
				this.$emit('close')
			}
		},
		destroy() {
			console.log("组件销毁")
		}
	}
</script>

<style scoped lang="less">
	.sku {
		padding: 20rpx;

		.absolute {
			margin-top: -100rpx;
			display: flex;
			align-items: center;

			.sku_image {
				width: 230rpx;
				height: 230rpx;
				outline: auto;
				outline-color: white;
			}

			.sku_info {
				padding-top: 75rpx;
				padding-left: 30rpx;
			}
		}

		.btn-box {
			margin-top: 40rpx;
			display: flex;
			align-items: center;
			justify-content: space-around;
			gap: 20rpx;
		}
	}
</style>